feat: add custom Image component

1 files changed, 5 insertions, 2 deletions

diff --git a/src/pages/[...path].tsx b/src/pages/[...path].tsx
index 75dd96d..ea67d17 100644
--- a/src/pages/[...path].tsx
+++ b/src/pages/[...path].tsx
@@ -3,6 +3,7 @@ import type { GetStaticPropsContext, NextPage } from 'next';
 import ReactMarkdown from 'react-markdown';
 import Head from 'next/head';
 import Emoji from '../Emoji';
+import Image from '../Image';
 import deepReadDir from '../deepReadDir';
 import emojiPlugin from '../emojiPlugin';
 import fs from 'fs';
@@ -53,18 +54,20 @@ const Page: NextPage = ({ markdownSource, emojiFileNames }: any) => {
       </Head>
       <main>
         <ReactMarkdown
-          children={markdownSource}
           transformLinkUri={transformLinkURI}
           rehypePlugins={[emojiPlugin(emojiFileNames), remarkGemoji]}
           components={{
             emoji: Emoji,
+            img: Image,
             h1: 'h2',
             h2: 'h3',
             h3: 'h4',
             h4: 'h5',
             h5: 'h6',
           } as any}
-        />
+        >
+          {markdownSource}
+        </ReactMarkdown>
       </main>
     </>
   );